<div class="relative">
  <%= image_tag('new_organization_bg.png', class: "w-full object-cover") %>
  <div class="absolute top-[35%] left-[50%] translate-x-[-50%] translate-y-[-50%]">
    <h3 class="text-[#101828] text-[30px] font-[500] my-[32px]"><%= t('sessions.sign_up_title') %></h3>
    <p>
      <% if flash[:alert].present? %>
        <el-alert title="<%= flash[:alert] %>" type="error" class="justify-center" />
      <% end %>
    </p>
    <%= form_tag('/signup', method: 'post') do %>
      <div class="my-[20px] flex flex-col gap-[6px]">
        <%= label_tag(:name, t('sessions.name')) %>
        <%= text_field_tag(:name, nil, required: true, placeholder: t('sessions.sign_up_name_placeholder'), class: 'w-[332px] h-[44px] rounded-[8px] py-[10px] px-[14px]') %>
      </div>
      <div class="my-[20px] flex flex-col gap-[6px]">
        <%= label_tag(:password, t('sessions.password')) %>
        <%= password_field_tag(:password, nil, required: true, class: 'w-[332px] h-[44px] rounded-[8px] py-[10px] px-[14px]') %>
      </div>
      <div class="my-[20px] flex flex-col gap-[6px]">
        <%= label_tag(:email, t('sessions.email')) %>
        <%= email_field_tag(:email, nil, required: true, class: 'w-[332px] h-[44px] rounded-[8px] py-[10px] px-[14px]') %>
      </div>
      <div class="my-[20px] flex flex-col gap-[6px]">
        <%= label_tag(:phone, t('sessions.phone')) %>
        <%= phone_field_tag(:phone, nil, required: true, class: 'w-[332px] h-[44px] rounded-[8px] py-[10px] px-[14px]') %>
      </div>
      <div class="my-[20px]">
        <%= submit_tag(t('sessions.submit'), class: 'w-[332px] h-[44px] bg-[#3250BD] text-white rounded-[8px]') %>
      </div>
      <P><%= t('sessions.already_has_account') %><a href="/login" class="text-[#3250BD]"> <%= t('sessions.sign_in') %> </a><p>
    <% end %>
  </div>
</div>